import { createRouter, createWebHistory } from 'vue-router';

// 导入视图组件
import Dashboard from '@/views/Dashboard.vue';
import Analytics from '@/views/Analytics.vue';
import Settings from '@/views/Settings.vue';

// 定义路由
const routes = [
  {
    path: '/',
    name: 'Dashboard',
    component: Dashboard,
    meta: {
      title: '仪表盘',
      icon: 'dashboard'
    }
  },
  {
    path: '/analytics',
    name: 'Analytics',
    component: Analytics,
    meta: {
      title: '数据分析',
      icon: 'analytics'
    }
  },
  {
    path: '/settings',
    name: 'Settings',
    component: Settings,
    meta: {
      title: '系统设置',
      icon: 'settings'
    }
  },
  // 404 页面处理
  {
    path: '/:pathMatch(.*)*',
    redirect: '/'
  }
];

// 创建路由实例
const router = createRouter({
  history: createWebHistory(),
  routes,
  scrollBehavior(to, from, savedPosition) {
    // 返回页面顶部
    return { top: 0 };
  }
});

// 全局前置守卫 - 设置页面标题
router.beforeEach((to, from, next) => {
  document.title = to.meta.title ? `${to.meta.title} | Vue3 数据可视化` : 'Vue3 数据可视化';
  next();
});

export default router;